<template>
  <div>
    <div class="pagination">
      <el-pagination
        background
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-size="pageSize"
        layout="total,prev, pager, next, jumper"
        :total="total"
        :style="{'text-align': position}"
		v-if="!pageSizeS">
      </el-pagination>
	  <el-pagination
	    background
	    @current-change="handleCurrentChange"
		 @size-change="handleSizeChange"
	    :current-page="currentPage"
	    :page-size="pageSize"
		:page-sizes="pageSizeS"
	    layout="total,sizes,prev, pager, next, jumper"
	    :total="total"
	    :style="{'text-align': position}"
		v-else>
	  </el-pagination>
    </div>
  </div>
</template>
<script>
/**
 * 分页
 * @param total 数据总条数
 * @param currentPage 当前选中的页数
 * @param pageSize 每页显示的条数
 * @param position 分页的位置 left center right , default: left
 *
 * return search 返回点击的页码
 */
export default {
  props: ['total', 'currentPage', 'pageSize', 'position','pageSizeS'],
  // props: {
	 //  colSpan: {
	 //    type: Number,
	 //    default() {
	 //      return 24
	 //    }
	 //  },
	 //  colSpan: {
	 //    type: Number,
	 //    default() {
	 //      return 24
	 //    }
	 //  },
	 //  colSpan: {
	 //    type: Number,
	 //    default() {
	 //      return 24
	 //    }
	 //  },
	 //  colSpan: {
	 //    type: Number,
	 //    default() {
	 //      return 24
	 //    }
	 //  },
	 //  colSpan: {
	 //    type: Number,
	 //    default() {
	 //      return 24
	 //    }
	 //  },
  // }
  data() {
    return {}
  },
  created() {
  },
  methods: {
    handleCurrentChange(page) {
      this.$emit('search', page)
    },
	handleSizeChange(size){
		this.$emit('change', size)
	}
  },
}
</script>
<style scoped lang="scss">
  .pagination{
    margin: 25px 0;
  }
</style>
